<!--表格输入文字-->
<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>表格输入文字</title>

</head>
<style>
    table {
        border-collapse: collapse;
    }

    td {
        border: 1px solid #000;
        /*padding: 5px;*/
        padding: 0;
        position: relative;
    }

    textarea {
        width: 100%;
        box-sizing: border-box;
        resize: none;
        overflow: hidden;
        border: 0;
    }
    textarea:focus{
        outline: 0
    }
</style>
<body>
<table id="myTable">
    <tr>
        <td><textarea id="cell1" oninput="adjustHeight(this)"></textarea></td>
        <td><textarea id="cell2" oninput="adjustHeight(this)"></textarea></td>
    </tr>
    <tr>
        <td><textarea id="cell3" oninput="adjustHeight(this)"></textarea></td>
        <td><textarea id="cell4" oninput="adjustHeight(this)"></textarea></td>
    </tr>
</table>

<script>
    function adjustHeight(textarea) {
        textarea.style.height = 'auto';
        textarea.style.height = textarea.scrollHeight + 'px';
    }
</script>
</body>

</html>